<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link href="../../assets/js/common/element/index.css" rel="stylesheet">
    <link href="../../build/common/base.css" rel="stylesheet">
    <script type="text/javascript" src="../../build/common/base.js"></script>
    <script type="text/javascript" src="../../build/common/vueEdit.js"></script>
    <style>
        td{
            color: #0BB20C;
        }
    </style>
</head>

<body>
<div id="ctrl">
    <div class="ibox-title">
        <!--<a class="btn btn-primary fa-save" href="javascript:void(0)" v-on:click="saveData">保存</a>-->
        <a href="javascript:void(0)" class="btn btn-primary fa-reply" onclick="javascript:$.Dialog.close(window);">返回</a>
    </div>
    <div v-if="loaded">
        <ab-custom-form></ab-custom-form>

    </div>

    <table id="tb_1" cellspacing="0" cellpadding="2" width="50%" border="1">
        <tbody >
        <tr >
            <td>对比参数/产品名称</td>
            <td  v-for="item in datas"> {{item.data.cl_material.materielId}}</td>
        </tr>

        <tr >
            <td>物料编码</td>
            <th  v-for="item in datas"> {{item.data.cl_material.productName}}</th>
        </tr>

        <tr>
            <td >产品名称</td>
            <th  v-for="item in datas"> {{item.data.cl_material.cplj1}}</th>
        </tr>

        <tr>
            <td>一级目录</td>
            <th  v-for="item in datas"> {{item.data.cl_material.cplj2}}</th>
        </tr>

        <tr>
            <td>二级目录</td>
            <th  v-for="item in datas"> {{item.data.cl_material.cplj3}}</th>
        </tr>

        <tr>
            <td>三级目录</td>
            <th  v-for="item in datas"> {{item.data.cl_material.cplj4}}</th>
        </tr>

        <tr>
            <td>四级目录</td>
            <th  v-for="item in datas"> {{item.data.cl_material.brand}}</th>
        </tr>

        <tr>
            <td>货品系列</td>
            <th  v-for="item in datas"> {{item.data.cl_material.goodsSeries}}</th>
        </tr>

        <tr>
            <td>产品型号</td>
            <th  v-for="item in datas"> {{item.data.cl_material.productModel}}</th>
        </tr>

        <tr>
            <td>规格/尺寸</td>
            <th v-for="item in datas"> {{item.data.cl_material.specifications}}</th>
        </tr>

        <tr>
            <td>单位</td>
            <th  v-for="item in datas"> {{item.data.cl_material.company}}</th>
        </tr>
        <tr>
            <td>单位</td>
            <th  v-for="item in datas"> {{item.data.cl_material.marketValue}}</th>
        </tr>

        <tr>
            <td>市场价</td>
            <th  v-for="item in datas"> {{item.data.cl_material.projectPrice}}</th>
        </tr>

        <tr>
            <td>工程价价格</td>
            <th v-for="item in datas"> {{item.data.cl_material.shipmentDate}}</th>
        </tr>

        <tr>
            <td>货期</td>
            <th  v-for="item in datas"> {{item.data.cl_material.placeOfOrigin}}</th>
        </tr>

        <tr>
            <td>产地</td>
            <th v-for="item in datas"> {{item.data.cl_material.state}}</th>
        </tr>

        <tr>
            <td>状态</td>
            <th  v-for="item in datas"> {{item.data.cl_material.materielId}}</th>
        </tr>
        </tbody>
    </table>

</div>
</body>
<script type="text/javascript">
    var vm = new Vue({
        el : "#ctrl",
        data : function() {
            return {
                loaded : false,
                datas:[]
            }
        },
        beforeCreate : function() {
        },
        methods : {
            saveData : function() {
                // var errorMsg = Vue.formService.getValidateMsg(this.$children[0]);
                // if (errorMsg) {
                //     $.Dialog.alert("表单校验不通过！" + errorMsg, 7);
                //     return;
                // }
                // // 业务校验
                // if (this.$children[0].custValid) {
                //     if (this.$children[0].custValid() === false) {
                //         return
                //     }
                // }


                // var url = Vue.__ctx + "/form/formDefData/saveData?key=" + $.getParam("key") + "&sql=" + $.getParam("sql");
                // var post = Vue.baseService.post(url, this.$children[0].$data.data);

                // post.then(function(data) {
                //     if (data.isOk) {
                //         if(parent && parent.reloadGrid){
                //             parent.reloadGrid();
                //         }
                //         $.Dialog.confirm("提示信息", "添加成功，是否需要继续添加", function() {
                //             window.location = window.location;
                //         }, function() {
                //             $.Dialog.close(window);
                //         })
                //     } else {
                //         $.Dialog.error(data.msg);
                //     }
                //
                // }, function(e) {
                //     alert(e);
                // });
            }
        },
        created : function() {
            var url = Vue.__ctx + "/form/formDefData/getDate";
            var post = Vue.baseService.postForm(url, {
                key : $.getParam("key"),
                id : $.getParam("id"),
                sql : $.getParam("sql"),
            });
            var that = this;
            $.getResultData(post, function(data) {
                debugger;
                that.datas = data
                window.custFormComponentMixin = {};
                for (let i =0 ; i< data.length; i ++){
                    console.log(data[i].data.cl_material.materielId);
                  /*  if(i==0){
                        document.getElementById("data1").innerHTML= data[i].data.cl_material.materielId;
                        document.getElementById("data2").innerHTML= data[i].data.cl_material.productName;
                        document.getElementById("data3").innerHTML= data[i].data.cl_material.cplj1;
                        document.getElementById("data4").innerHTML= data[i].data.cl_material.cplj2;
                        document.getElementById("data5").innerHTML= data[i].data.cl_material.cplj3;
                        document.getElementById("data6").innerHTML= data[i].data.cl_material.cplj4;
                        document.getElementById("data7").innerHTML= data[i].data.cl_material.brand;
                        document.getElementById("data8").innerHTML= data[i].data.cl_material.goodsSeries;
                        document.getElementById("data9").innerHTML= data[i].data.cl_material.productModel;
                        document.getElementById("data10").innerHTML= data[i].data.cl_material.specifications;
                        document.getElementById("data11").innerHTML= data[i].data.cl_material.company;
                        document.getElementById("data12").innerHTML= data[i].data.cl_material.marketValue;
                        document.getElementById("data13").innerHTML= data[i].data.cl_material.projectPrice;
                        document.getElementById("data14").innerHTML= data[i].data.cl_material.shipmentDate;
                        document.getElementById("data15").innerHTML= data[i].data.cl_material.placeOfOrigin;
                        document.getElementById("data16").innerHTML= data[i].data.cl_material.state;
                    }*/
                    //this.datas = data[i].data.cl_material.materielId;
                   /* if (window.passData) {// 前端html传过来
                        data[i].html = window.passData.html;
                    }

                    Vue.formService.initCustFormFu(data[i].html, data[i]);
                    that.$data.loaded = true;*/

                }
                // var html = data.html;
                // if (window.passData) {// 前端html传过来
                //     html = window.passData.html;
                // }
                //
                // Vue.formService.initCustFormFu(html, data);
                // that.$data.loaded = true;
            });
        },
        watch : {

        }
    });
</script>
</html>